<template>
  <div id="app">
   <List-One :frames="frames"></List-One>
   <list-Two :frames="frames"></list-Two>
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'
import ListOne from './components/ListOne.vue'
import ListTwo from './components/ListTwo.vue'
export default {
  name: 'App',
  data(){
	  return{
		 //  frames:[{
			//   name:'vue,js',star:15
		 //  },{
			//   name:'React.js',star:13
		 //  },{
			// name:'Angular.js',star:12  
		 //  }]
	  }
  },
  components: {
    HelloWorld,
	ListOne,
	ListTwo
  }
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
